<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>租房</title>
    <link rel="stylesheet" href="./css/font-icon.css">
    <link rel="stylesheet" href="css/reting.css">
    <link rel="stylesheet" href="css/public.css">
    <script src="js/zepto.js"></script>
    <script src="js/setRem.js"></script>
</head>

<body>
    <div class="wrap">
        <header>
            <div>
                <img src="images/index/logo.jpg" alt="">
                <select name="" id="beij">
                    <option value="北京">北京</option>
                </select>
            </div>
            <div>
                <img id="my" src="images/index/my.jpg" alt="">
                <img src="images/index/xiazai.jpg" alt="">
            </div>
        </header>
    </div>
    <section class="wode">
        <a href="#">首页</a>
        <img src="images/my/right.png" alt="">
        <a href="#">北京租房</a>
    </section>
    <div class="shuru">
        <p></p>
    </div>
    <div class="selec selec-btn">
        <span>
            区域
            <em class="lsf">down</em>
        </span>
        <span>
            月租
            <em class="lsf">down</em>
        </span>
        <span>
            房型
            <em class="lsf">down</em>
        </span>
        <span>
            更多
            <em class="lsf">down</em>
        </span>
    </div>
    <section class="hothouse">
        <div class="house">
            <img src="images/SecondHandList/img1.png" alt="">
            <div>
                <strong>南沙滩小区 超低价急售</strong>
                <div class="grey">
                    <p>2室1厅 96㎡ 南北</p>
                </div>
                <p class="grey">青岛新天地</p>
                <div>
                    <button>集中供暖</button>
                    <span>1105元/月</span>
                </div>
            </div>
        </div>
        <div class="house">
            <img src="images/SecondHandList/img2.png" alt="">
            <div>
                <strong>青年汇二期 免税三层</strong>
                <div class="grey">
                    <p>3室2厅 129㎡ 南北</p>
                </div>
                <p class="grey">青年汇家园</p>
                <div>
                    <button>集中供暖</button>
                    <span>1610元/月</span>
                </div>
            </div>
        </div>
        <div class="house">
            <img src="images/SecondHandList/img3.png" alt="">
            <div>
                <strong>博雅德源稀缺两居 钥匙房源</strong>
                <div class="grey">
                    <p>2室2厅 126㎡ 南北</p>
                </div>
                <p class="grey">西二旗</p>
                <div>
                    <button>集中供暖</button>
                    <span>3420元/月</span>
                </div>
            </div>
        </div>
        <div class="house">
            <img src="images/SecondHandList/img4.png" alt="">
            <div>
                <strong>朝阳北路 赠车库 自住首选！</strong>
                <div class="grey">
                    <p>5室3厅 260㎡ 南北</p>
                </div>
                <p class="grey">武夷花园二手房</p>
                <div>
                    <button>集中供暖</button>
                    <span>5408元/月</span>
                </div>
            </div>
        </div>
        <div class="house">
            <img src="images/SecondHandList/img5.png" alt="">
            <div>
                <strong>金汉旭城 东南金角一居</strong>
                <div class="grey">
                    <p>1室1厅 60㎡ 南北</p>
                </div>
                <p class="grey">谷雨二手房</p>
                <div>
                    <button>集中供暖</button>
                    <span>3300元/月</span>
                </div>
            </div>
        </div>
        <div class="house">
            <img src="images/SecondHandList/img6.png" alt="">
            <div>
                <strong>南沙滩小区 超低价急售</strong>
                <div class="grey">
                    <p>2室1厅 96㎡ 南北</p>
                </div>
                <p class="grey">青岛新天地</p>
                <div>
                    <button>集中供暖</button>
                    <span>1105元/月</span>
                </div>
            </div>
        </div>
        <div class="house">
            <img src="images/SecondHandList/img7.png" alt="">
            <div>
                <strong>南沙滩小区 超低价急售</strong>
                <div class="grey">
                    <p>2室1厅 96㎡ 南北</p>
                </div>
                <p class="grey">青岛新天地</p>
                <div>
                    <button>集中供暖</button>
                    <span>1105元/月</span>
                </div>
            </div>
        </div>
    </section>
    <footer>
        <h6>北京找房无忧网&gt;首页</h6>
        <ul>
            <li>
                <img src="images/index/apple.png" alt="">
                <p>iPhone客户端</p>
            </li>
            <li>
                <img src="images/index/android.png" alt="">
                <p>Android客户端</p>
            </li>
        </ul>
        <p>北京找房无忧房地产经纪有限公司</p>
        <p>网络经营许可证 京ICP备20160812号-12</p>
    </footer>



    <!-- 悬浮层 -->
    <div class="float" id="card">
        <div class="selec" id="tagNav">
            <span>
                区域
                <em class="lsf">down</em>
            </span>
            <span>
                月租
                <em class="lsf">down</em>
            </span>
            <span>
                房型
                <em class="lsf">down</em>
            </span>
            <span>
                更多
                <em class="lsf">down</em>
            </span>
        </div>

        <!-- 区域 -->
        <section class="area-classify">
            <aside class="prime">
                <p class="area-classify-active area-active">区域</p>
                <p>地铁</p>
            </aside>
            <aside class="inferior">
                <p>附近</p>
                <p>不限</p>
                <p class="area-active">朝阳</p>
                <p>海淀</p>
                <p>昌平</p>
                <p>丰台</p>
                <p>石景山</p>
            </aside>
            <aside class="floor-level">
                <p class="area-active">不限</p>
                <p>安贞</p>
                <p>奥林匹克公园</p>
                <p>百子湾</p>
                <p>北工大</p>
                <p>北苑</p>
                <p>CBD</p>
            </aside>
        </section>
        <!-- 价格 -->
        <section class="price-classify">
            <div>不限</div>
            <p>100万以下</p>
            <p>100万-150万</p>
            <p>150万-200万</p>
            <p>200万-250万</p>
            <p>250万-300万</p>
            <aside>
                <span>自定义价格</span>
                <input type="text" placeholder=" 最小">
                <span>-</span>
                <input type="text" placeholder=" 最大">
                <a href="javascript:;">确定</a>
            </aside>
        </section>

        <!-- 房型 -->
        <section class="houseconfig-classify">
            <p>不限</p>
            <p>
                1室
                <input type="checkbox">
            </p>
            <p>
                2室
                <input type="checkbox">
            </p>
            <p>
                3室
                <input type="checkbox">
            </p>
            <p>
                4室
                <input type="checkbox">
            </p>
            <p>
                5室
                <input type="checkbox">
            </p>
            <div>确定</div>
        </section>

        <!-- 更多 -->
        <section class="for-more-classify">
            <div class="card-r">
                <h3>区域</h3>
                <div class="tag-cmp">
                    <span>南</span>
                    <span>南北</span>
                    <span>东</span>
                    <span>西</span>
                    <span>北</span>
                </div>
            </div>
            <div class="card-r">
                <h3>面积（平米）</h3>
                <div class="tag-cmp">
                    <span>50以下</span>
                    <span>50-70</span>
                    <span>70-90</span>
                    <span>90-110</span>
                    <span>110-130</span>
                    <span>130-150</span>
                    <span>150-200</span>
                    <span>200以上</span>
                </div>
            </div>
            <div class="card-r">
                <h3>标签</h3>
                <div class="tag-cmp">
                    <span>学区房</span>
                    <span>地铁</span>
                    <span>不限购</span>
                    <span>满两年</span>
                    <span>满五唯一</span>
                    <span>降价</span>
                    <span>新上</span>
                    <span>独家</span>
                    <span>有钥匙</span>
                </div>
            </div>
            <div class="card-r">
                <h3>楼龄</h3>
                <div class="tag-cmp">
                    <span>5年以内</span>
                    <span>10年以内</span>
                    <span>10-20年</span>
                    <span>20年以上</span>
                </div>
            </div>
            <div class="card-r">
                <h3>楼层</h3>
                <div class="tag-cmp">
                    <span>低楼层</span>
                    <span>中楼层</span>
                    <span>高楼层</span>
                </div>
            </div>
            <p>清空条件</p>
            <a href="javascript:;">确定</a>
        </section>
        <div class="shadow"></div>
    </div>
    <script src="./js/reting.js"></script>
    <script src="./js/reting.js"></script>
</body>

</html>